<template>
  <div class="prescriptionData">
    <backTopName :show="notshow" :data="backTopname" />
    <div class="prescriptionData_body">
      <template v-for="item in docpresList" :key="item.id">
        <prescripDataTable :item="item" />
      </template>
      <div class="prescriptionData_addIcon">
        <div class="prescriptionData_addIcon_plus" @click="toAddDocpres">
          <van-icon name="plus" />
        </div>
      </div>
      <div class="prescriptionData_subbmit">
        <van-button type="primary" size="large" @click="toSubmmitMedicine">
          提交
        </van-button>
      </div>
    </div>
  </div>
</template>

<script>
import MJCrequesting from "@/service/index.js";
import { useRouter } from "vue-router";
import { Dialog } from "vant";
import store from "@/store";
import { reactive, computed, onUnmounted, onMounted } from "vue";
import prescripDataTable from "./cmp/prescripDataTable.vue";
import backTopName from "@/components/commonComponents/backTopName.vue";
export default {
  name: "prescriptionData",
  components: { backTopName, prescripDataTable },
  beforeRouteLeave(to, from, next) {
    // ...
    store.commit("doctorUsepres/reFreshDocpresList");
    next();
  },
  setup() {
    const router = useRouter();
    const notshow = false;
    const backTopname = {
      name: "新建药单",
    };
    const docpresList = computed(() => store.state.doctorUsepres.docpresList);
    const toAddDocpres = () => {
      store.commit("doctorUsepres/addDocpresList");
    };
    const toSubmmitMedicine = () => {
      Dialog.confirm({
        message: "确定要提交吗",
      })
        .then(() => {
          // on confirm
          router.push({ path: "/prescriptionmedicine" });
        })
        .catch(() => {
          // on cancel
        });
    };
    const toRefresh = () => {};
    onUnmounted(() => {
      store.commit("doctorUsepres/reFreshinitialValue");
    });
    // onMounted(() => {
    //   const formData = new FormData();
    //   const patient = {
    //     realname: "王五",
    //     phone: "18665822336",
    //     area: "广东省江门市蓬江区",
    //     age: "22",
    //     gender: "男",
    //   };
    //   const obj2 = {
    //     name: "江门市第一人民医院",
    //     area: "广东省江门市蓬江区",
    //     tel_booking: "07501234567",
    //     tel_review: "07501234567",
    //   };
    //   const obj3 = {
    //     id: "78956423012",
    //     time: "2019/11/25 10:14:45",
    //     doctor: "傅 国 彦",
    //     section: "骨科",
    //     diagnostic: ["腰椎扭伤", "踝关节扭伤"],
    //     prescription_boxes: [
    //       {
    //         qrcode: 1230000001,
    //         cells: [
    //           {
    //             Time: "08:30",
    //             before_meal: "false",
    //             after_meal: "true",
    //             pills: [
    //               {
    //                 medicine_code: "6926953810319",
    //                 medicine_name: "苯磺酸氨氯地平片",
    //                 Num: 3,
    //                 type: "eat",
    //               },
    //             ],
    //           },
    //         ],
    //       },
    //     ],
    //   };
    //   formData.append("machine_id", "m00010");
    //   formData.append("patient_id", "7894565589600000000");
    //   formData.append("phoneNumber", "18665822336");
    //   formData.append("patient", JSON.stringify(patient));
    //   formData.append("hospital", JSON.stringify(obj2));
    //   formData.append("medicineList", JSON.stringify(obj3));

    //   MJCrequesting.request({
    //     url: "/appPrescriptions/uploadAppPrescriptions",
    //     data: formData,
    //     method: "POST",
    //     headers: {
    //       "Content-Type": "multipart/form-data",
    //     },
    //   });
    // });
    return {
      notshow,
      backTopname,
      docpresList,
      toAddDocpres,
      toRefresh,
      toSubmmitMedicine,
    };
  },
};
</script>

<style lang="scss" scope>
.prescriptionData {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  background-color: #fafafa;
  z-index: 9;
  &_subbmit {
    padding: 5px 20px;
  }
  &_addIcon {
    height: 80px;
    font-size: 24px;
    padding: 5px 20px;
    &_plus {
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #f1eeee;
    }
  }
}
</style>
